<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <title>退款详情</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
    <link rel="stylesheet" href="/node_modules/LobsterUIFrame/weui/css/weui.css" />
    <link rel="stylesheet" href="/node_modules/LobsterUIFrame/weui/css/weuix.css" />
    <script src="/node_modules/LobsterUIFrame/weui/js/zepto.min.js"></script>
    <script src="/node_modules/LobsterUIFrame/weui/js/zepto.weui.js"></script>
    <script src="/node_modules/LobsterUIFrame/weui/js/swipe.js"></script>
    <script src="/node_modules/LobsterUIFrame/weui/js/macy.js"></script>
    <script src="/node_modules/LobsterUIFrame/weui/js/php.js"></script>
    <script src="/lobstersdk/lobster.js"></script>
    <script src="/jslib/template-web.js"></script>
    <style>
        .bottom {
            background-color: #F5F5F5;
            position: fixed;
            bottom: 0;
            left: 0;
            right: 0;
            align-items: center;
            display: flex;
            padding: 10px 4px;
            z-index: 2;
        }

        .btn {
            height: 40px;
            line-height: 40px;
        }
    </style>
</head>

<body ontouchstart>

</body>

</html>

<script type="text/template" id="refundtemp">
      <div class="weui-cells__title">商品信息</div>
    <div class="weui-panel__bd" id="goods">
        <a href="javascript:void(0);" class="weui-media-box weui-media-box_appmsg">
            <div class="weui-media-box__hd">
                <img class="weui-media-box__thumb" src="{{refund.SpecImg}}" alt="">
            </div>
            <div class="weui-media-box__bd">
                <h4 class="weui-media-box__title">{{refund.GoodsName}}</h4>
                <p class="weui-media-box__desc">规格：{{refund.SpecName}}</p>
                <div class="weui-media-box__desc" style="display: flex;"> ￥{{refund.GoodsPrice}}<div style="flex:1;text-align:right">
                    </div>x{{refund.GoodsNum}}</div>
            </div>
        </a>
    </div>
    <div class="weui-cells__title">退款信息</div>
    <div class="weui-cells">
        <div class="weui-cell">
            <div class="weui-cell__bd">
                <p>退款原因</p>
            </div>
            <div class="weui-cell__ft">{{refund.RefundDesc}}</div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__bd">
                <p>退款金额</p>
            </div>
            <div class="weui-cell__ft">{{refund.RefundFee}}</div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__bd">
                <p>申请件数</p>
            </div>
            <div class="weui-cell__ft">{{refund.GoodsNum}}</div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__bd">
                <p>申请时间</p>
            </div>
            <div class="weui-cell__ft">{{(refund.RefundDate||"").substring(0,19)}}</div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__bd">
                <p>退款编号</p>
            </div>
            <div class="weui-cell__ft">{{refund.RefundNo}}</div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__bd">
                <p>退款状态</p>
            </div>
            <div class="weui-cell__ft">{{refund.RefundStatustxt}}</div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__bd">
                <p>退款时间</p>
            </div>
            <div class="weui-cell__ft">{{(refund.SuccessTime||"").substring(0,19)}}</div>
        </div>
        {{if(refund.RefundStatus==99)}}
        <div class="weui-cell">
            <div class="weui-cell__bd">
                <p>审核结果</p>
            </div>
            <div class="weui-cell__ft" style="color:red;">{{refund.AuditMemo}}</div>
        </div>
        {{/if}}
    </div>
    <div class="timeline">
        <ul>
            {{each loglist item idx}} 
            <li class="timeline-item">
                {{if(idx==0)}}
                <div class="timeline-item-color timeline-item-head-first"><i
                        class="timeline-item-checked   weui-icon-success-no-circle"></i>
                </div>
                {{else}}
                <div class="timeline-item-color timeline-item-head"></div>
                {{/if}}
                <div class="timeline-item-tail" ></div>
                <div class="timeline-item-content"><h4 class="recent">{{item.Memo}}</h4>
                    <p class="recent">{{(item.OperationTime||"").substring(0,19)}}</p></div>
            </li> 
            {{/each}}
        </ul>
    </div>
    <div style="height:50px;"></div>
    {{if(refund.RefundStatus==0||refund.RefundStatus==1)}}
    <div class="bottom">
        <div style="flex:1;text-align:right;">
            {{if(refund.RefundStatus==0)}}
            <a href="javascript:;"
                class="btn weui-btn weui-btn_mini weui-btn_primary bg-orange tocancelrefund"></i>撤销申请</a>
            {{/if}}
            {{if(refund.RefundStatus==1&&refund.CargoStatus==2)}}
            <a href="javascript:;"
                class="btn weui-btn weui-btn_mini weui-btn_primary bg-orange toconfirmsendback"></i>填写单号</a>
            {{/if}}
        </div>
    </div>
    {{/if}}
</script>

<script>

    lobsterh5.main({
        data: {
            refund: {

            },
            loglist: [],
        },
        //初始化页面
        pageload: function () {
            var self = this;
            self.initevent();
            self.data.refund.RefundNo = lobsterh5.GetUrlParam("refundNo");
            Promise.all([self.getRefundByRefundNo(), self.getDic(8147), self.getRefundLogByRefundNo()]).then(res => {
                self.data.refund = res[0].refund;
                var refundstatus = res[1].appbasedict;
                self.data.loglist = res[2].loglist;
                var filter = refundstatus.filter(a => {
                    return a.Code == self.data.refund.RefundStatus;
                });
                if (filter.length > 0)
                    self.data.refund.RefundStatustxt = filter[0].Name;
                var html = template("refundtemp", { refund: self.data.refund, loglist: self.data.loglist });
                $("body").html(html);
            }).catch(res => {
                console.log(res.msg);
            })
        },
        //初始化事件
        initevent: function () {
            var self = this;
            $(document).on("click", ".tocancelrefund", function () {
                $.confirm("提示", "确定撤销吗？", function () {
                    $.showLoading("退款中");
                    lobsterh5.POST("/lowcode/APP20200616102057595/shop/?fun=mall.CancelRefund", self.data.refund).then(res => {
                        $.hideLoading();
                        location.href = "list.html";
                    }).catch(res => {
                        $.toast(res.msg, 'forbidden');
                    })

                })
            })
            $(document).on("click", ".toconfirmsendback", function () {
                location.href = "fillin.html?refundNo=" + self.data.refund.RefundNo;
            })
        },
        getRefundByRefundNo: function () {
            var self = this;
            return new Promise((resolve, reject) => {
                lobsterh5.GET("/lowcode/APP20200616102057595/shop/?fun=mall.GetRefundByRefundNo", {
                    refundNo: self.data.refund.RefundNo,
                    userId: localStorage.getItem("userId")
                }).then(res => {
                    resolve(res);
                }).catch(res => {
                    reject(res);
                });
            })
        },
        getRefundLogByRefundNo: function () {
            var self = this;
            return new Promise((resolve, reject) => {
                lobsterh5.GET("/lowcode/APP20200616102057595/shop/?fun=mall.GetRefundLogByRefundNo", {
                    refundNo: self.data.refund.RefundNo,
                }).then(res => {
                    resolve(res);
                }).catch(res => {
                    reject(res);
                });
            })
        },
        //获取支付类型字典 
        getDic: function (classId) {
            return new Promise((resolve, reject) => {
                lobsterh5.GET("/common/v1/BasicData/GetAppBaseDict", {
                    classId: classId,
                    appKey: "APP20200616102057595"
                }).then(res => {
                    resolve(res);
                }).catch(res => {
                    reject(res);
                });
            })
        },
    })
</script>